<template>
	<view class="classifylist-container">
		<view>
				<uv-skeletons :loading="loading" :skeleton="skeleton"></uv-skeletons>
			</view>
		<view class="wrap">
			<navigator :key="item._id"   v-for="item in classifyList" :url="`/pages/preview/preview?id=${item._id}`" class="item">
				<image :src="item.smallPicurl" mode="aspectFill"></image>
			</navigator>
		</view>
	<uni-load-more v-if="classifyList.length!=0" :status="isCanLoadingMore?'more':'no-more'"></uni-load-more>

	<view class="safe-area-inset-bottom">
		
	</view>
	</view>
</template>

<script setup lang="ts">
import { ref } from 'vue';
import { IClassifyList } from '../../api/type';
import {onLoad,onUnload,onReachBottom,onShareAppMessage,onShareTimeline} from "@dcloudio/uni-app"
import { apiGetClassifyList, apiGetHistoryList } from '../../api/apis';
import {PreviewListModel} from '../../services/previewModel'
import { goHome } from '../../utils/goHome';
let classifyList = ref<IClassifyList[]>([])
let classifyId = ref<string>('')
let queryParam:any = {
	pageNum:1,
	pageSize:12,
	classid:''
}
let name = ''
let preivewListModel =  PreviewListModel.getInstance();
let isCanLoadingMore = ref(true)
let loading = ref(true)
const skeleton=[{
					type: 'flex',
					children:[
						{
							type: 'custom',
							style: 'width:240rpx;height:440rpx;',
						},
						{
							type: 'custom',
							style: 'width:240rpx;height:440rpx;marginLeft:5rpx;'
						}, 
						{
							type: 'custom',
							style: 'width:240rpx;height:440rpx;marginLeft:5rpx;'
						}, 
					],
					num:3,
					gap: '20rpx'
				}]
onLoad((query)=>{
	console.log(query);
	name=query.name;
	// if(!query.id) goHome();
	
	uni.setNavigationBarTitle({
		title:query.name
	})
	classifyId.value = query.id;
	queryParam.classid = query.id
	query.type?queryParam.type=query.type:'';
	getClassifyList(queryParam)
})
onUnload(()=>{
	preivewListModel.clearPreviewList()
})
onShareAppMessage(e=>{
	return{
		title:name,
		path:'pages/classifylist/classifylist?id='+classifyId.value+'&name='+name
	}
})

onShareTimeline(()=>{
	return {
		title:name,
		query:'id='+classifyId.value+'&name='+name
	}
})
async function getClassifyList(data){
	let res:IClassifyList[];
	if(data.type){
		res = await apiGetHistoryList(data);
		console.log(res);
	}else{
		res=  await apiGetClassifyList(data);
	}
	
	console.log(data);
	if(res.length==0){
		isCanLoadingMore.value = false
		uni.showToast({
			title:'没有更多数据了',
			icon:'none'
		})
		loading.value = false
	}else{
		loading.value = false
		classifyList.value = [...classifyList.value,...res];
		preivewListModel.setPreviewList(classifyList.value)
	}
	
}

onReachBottom(()=>{
	queryParam.pageNum++
	getClassifyList(queryParam)
})
</script>

<style lang="scss" scoped>
	       .classifylist-container{
			   .wrap{
				   padding:5rpx;
				   width: 100%;
				   display: grid;
				   grid-template-columns: repeat(3,1fr);
				   gap: 5rpx;
				   .item{
					   width: 100%;
					   height: 440rpx;
					  
					   image{
						   width: 100%;
						   height: 100%;
						    display: block;
					   }
				   }
			   }
		   }
</style>
